<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>fixed</title>
    <style>
        .main-left {
            background-color: aqua;
            height: 200px;
            width: 200px;
            /* fixed定位 */
            position: fixed;
            left: 100px;
            top: 100px;
        }

        .main-right {
            background-color: cadetblue;
            height: 200px;
            width: 200px;
            /* fixed定位 */
            position: fixed;
            right: 100px;
            bottom: 100px;
        }
    </style>
</head>

<body>

        <div class="main-left">
        </div>
        <div class="main-right">
        </div>
        <!-- 
            absolut 跟 fixed 区别？
            都是绝对定位，二者有一致性，也有不同点。
            那么二者的区别是什么呢？
            那就是position的fixed值定位的元素会固定在原来的位置不变，
            不管你如何拖动滚动条，元素都不会改变位置，
            这从fixed这个英文单词的意思也可以看出，
            “固定的，不变的，固执的”。
            而absolute正好相反，拖动滚动条时元素会随着改变位置。
         -->

</body>

</html>